<template>
  <div>
    <ul>
      <li class="bgImg" v-for="(item, index) in imgList" :style="getBgStyle(item)"></li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Test3",
  data() {
    return {
      imgList: [
        {imgUrl: require("../assets/radar/1.png")},
        {imgUrl: require("../assets/radar/2.png")},
        {imgUrl: require("../assets/radar/3.png")},
        {imgUrl: require("../assets/radar/4.png")},
      ]
    }
  },
  methods: {
    getBgStyle(item) {
      return {
        backgroundImage: `url('${item.imgUrl}')`
      }
    }
  }
}
</script>

<style scoped>
  .bgImg {
    background-position: center center;
    width: 100px;
    height: 100px;
  }
</style>